<template>
    <div>
        <div class="back">
            <i class="mintui mintui-back backBtn" @click="backFirst"></i>
        </div>
        <div class="shop-list">
            <ul>
                <li v-for="(key,index) in allDetail" :key="index">
                    {{key}}
                </li>
            </ul>
            <mt-button size="normal" type="primary" @click="collect">收藏</mt-button>
        </div>
        <div>

        </div>
    </div>
</template>

<script>
import { mapActions, mapState,mapGetters } from "vuex";
export default {
  data() {
    return {
      allDetail: {},
      updateId: "",
      status: false
    };
  },
  computed: {
    ...mapState({
      lists: state => state.lists
    })
  },
  methods: {
    ...mapActions(["getList", "updateList"]),
    backFirst() {
      this.$router.push("/home/firstPage");
    },
    getListDet() {
      this.getList();
    },
    collect(arr) {
      this.updateId = this.allDetail.id;
      this.$messagebox({
        title: "温馨提示",
        message: "是否确认收藏此条信息",
        showCancelButton: true,
        confirmButtonText: "确认收藏",
        cancelButtonText: "取消收藏"
      }).then(action => {
        if (action == "confirm") {
          this.updateList({id: this.updateId,status:"已收藏"})
         .then( res =>{
              this.$router.push({name:'collect'})
         })
        } else {
            alert('不收藏此条信息')
        }
      });
    //   console.log(this.allDetail);
    }
  },
  mounted() {
    this.allDetail = this.$route.params;
    // console.log(2)
  }
};
</script>

<style scoped>
.back {
  height: 40px;
  line-height: 40px;
  background: #ccc;
}
.back .backBtn {
  margin-left: 13px;
  color: #666;
  font-size: 26px;
}
.shop-list ul li {
  list-style-type: disc;
  height: 60px;
  line-height: 60px;
  font-size: 20px;
  text-indent: 20px;
  margin-bottom: 20px;
  background: #fff;
}
.shop-list button {
  float: right;
  margin: 15px 20px;
}
</style>